<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">
    <ui:composition template="comunLocales.xhtml">
        <ui:define name="body">
            <h:form id="formularioCreacionUsuarioSucursalID"  >

                <p:remoteCommand  name="iniciarDatos"
                                  process="@this"
                                  update="formularioCreacionUsuarioSucursalID"
                                  actionListener="#{creacionUsuarioSucursalControlador.iniciarDatos()}" />

                <p:messages id="msgs" autoUpdate="true"/>
                <h:panelGrid columns="1" cellspacing="5">
                    <f:facet name="header" >
                        Creación Usuario para sucursales
                    </f:facet>
                    <h:panelGrid id="panelSeleccionSucursalID" columns="2" cellspacing="5">
                        <h:outputLabel value="Sucursales" />
                        <h:selectOneMenu value="#{creacionUsuarioSucursalDataManager.sucursal}" >
                            <f:converter converterId="sucursalConvertidor" />
                            <f:selectItems value="#{creacionUsuarioSucursalControlador.selectItemSucursales}"/>
                            <p:ajax event="change" update="panelIngresoUsuariosID msgs panelUsuariosCreadosID"  
                                    process="@this"
                                    listener="#{creacionUsuarioSucursalControlador.seleccionaSucursal()}">
                            </p:ajax>   
                        </h:selectOneMenu>
                    </h:panelGrid>

                    <h:panelGrid id="panelIngresoUsuariosID" columns="1" cellspacing="5">
                        <h:panelGrid  columns="2" cellspacing="5">
                            <h:panelGrid  columns="2" cellspacing="5">
                                <h:outputLabel value="Nombre:*" />
                                <h:inputText value="#{creacionUsuarioSucursalDataManager.usuarioSucursal.usNombre}" 
                                             required="true" 
                                             requiredMessage="El nombre es requerido"
                                             validatorMessage="El Nombre debe poseer máximo 20 caracteres"
                                             onkeyup="javascript:this.value=this.value.toUpperCase();">
                                    <f:validateLength maximum="20" />
                                </h:inputText>
                                <h:outputLabel value="Apellido:*" />
                                <h:inputText value="#{creacionUsuarioSucursalDataManager.usuarioSucursal.usPrimerApellido}"
                                             required="true" requiredMessage="El primer apellido es requerido"
                                             validatorMessage="El apellido debe poseer máximo 20 caracteres"
                                             onkeyup="javascript:this.value=this.value.toUpperCase();">
                                    <f:validateLength maximum="20" />
                                </h:inputText>
                            </h:panelGrid>
                            <h:panelGrid  columns="2" cellspacing="5">
                                <h:outputLabel value="Correo:*" />
                                <h:inputText id="ingCorreoUsuarioSucursalID" size="25" 
                                             value="#{creacionUsuarioSucursalDataManager.usuarioSucursal.usCorreo}" 
                                             required="true" 
                                             requiredMessage="El correo es requerido">
                                    <f:validator binding="#{mailValidador}" />
                                </h:inputText>

                                <h:outputLabel value="Contraseña:*" />
                                <p:password id="ingPassUsuarioSucursalID" value="#{creacionUsuarioSucursalDataManager.usuarioSucursal.usContrasena}" 
                                            feedback="true" size="25" match="ingPassUsuarioSucursalID2"
                                            validatorMessage="La contraseña debe poseer máximo 10 caracteres"
                                            requiredMessage="La contraseña es requerida"
                                            required="true"
                                            style="background-color: white; background-image: none">
                                    <f:validateLength maximum="10" />
                                </p:password>

                                <h:outputLabel value="Confirme Contraseña:*" />
                                <p:password id="ingPassUsuarioSucursalID2" value="#{creacionUsuarioSucursalDataManager.usuarioSucursal.usContrasena}" 
                                            feedback="true" size="25" 
                                            required="true" 
                                            requiredMessage="La contraseña es requerida"
                                            validatorMessage="La contraseña debe poseer máximo 10 caracteres"
                                            style="background-color: white; background-image: none">
                                    <f:validateLength maximum="10" />
                                </p:password>
                            </h:panelGrid>
                        </h:panelGrid>
                        <p:commandButton id="btnCrearUsuarioSucursalID" 
                                         action="#{creacionUsuarioSucursalControlador.crearUsuarioSucursal()}" 
                                         value="Crear Usuario"
                                         process="panelIngresoUsuariosID panelSeleccionSucursalID"
                                         update="panelIngresoUsuariosID msgs panelUsuariosCreadosID"/>
                    </h:panelGrid>
                </h:panelGrid>
                <p:separator />
                <h:panelGrid id="panelUsuariosCreadosID" columns="1" cellspacing="5"> 
                    <f:facet name="header" >
                        Usuarios creados por sucursal
                    </f:facet>
                    <p:dataTable value="#{creacionUsuarioSucursalDataManager.usuariosCreados}" var="usuario" 
                                 paginator="true"
                                 rows="5" 
                                 paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                                 rowsPerPageTemplate="5,10,15"
                                 emptyMessage="No existe datos para mostrar">
                        <p:column  headerText="Nombre " sortBy="#{usuario.usNombre}">
                            <h:outputText value="#{usuario.usNombre}"/>
                        </p:column>
                        <p:column  headerText="Apellido " sortBy="#{usuario.usPrimerApellido}">
                            <h:outputText value="#{usuario.usPrimerApellido}"/>
                        </p:column>
                        <p:column  headerText="Estado " sortBy="#{usuario.usEstado}">
                            <h:outputText value="#{usuario.usEstado}"/>
                        </p:column>
                        <p:column  headerText="Editar " >
                            <p:commandLink value="Editar" process="@this" 
                                           oncomplete="dialogEditarUsuarioSucursal.show();"
                                           update=":dialogEditarUsuarioSucursalID">
                                <f:setPropertyActionListener target="#{creacionUsuarioSucursalDataManager.usuarioSeleccionado}" value="#{usuario}"/>
                            </p:commandLink>
                        </p:column>
                    </p:dataTable>
                </h:panelGrid>
            </h:form>
            <p:dialog id="dialogEditarUsuarioSucursalID" header="Edición usuario sucursal"
                      widgetVar="dialogEditarUsuarioSucursal" dynamic="true" > 

                <p:ajax event="close"  listener="#{creacionUsuarioSucursalControlador.cerrarDialogo()}" 
                        update=":dialogEditarUsuarioSucursalID :formularioCreacionUsuarioSucursalID:panelUsuariosCreadosID :formularioCreacionUsuarioSucursalID:panelIngresoUsuariosID"/> 

                <h:form id="formDialogoEditarUsuario"> 
                    
                    <p:outputPanel id="panelEdicionUsuarioSucursalID" 
                                   layout="block" >
                        <h:panelGrid  columns="2" cellspacing="5">
                            <h:panelGrid  columns="2" cellspacing="5">

                                <h:outputLabel value="Nombre:*" />
                                <h:inputText id="editarUsuarioNombreID" value="#{creacionUsuarioSucursalDataManager.usuarioSeleccionado.usNombre}" 
                                             required="true" 
                                             requiredMessage="El nombre es requerido"
                                             validatorMessage="El Nombre debe poseer máximo 20 caracteres"
                                             onkeyup="javascript:this.value=this.value.toUpperCase();">
                                    <f:validateLength maximum="20" />
                                </h:inputText>
                                <h:outputLabel value="Apellido:*" />
                                <h:inputText id="editarUsuarioApellidoID" value="#{creacionUsuarioSucursalDataManager.usuarioSeleccionado.usPrimerApellido}"
                                             required="true" requiredMessage="El primer apellido es requerido"
                                             validatorMessage="El apellido debe poseer máximo 20 caracteres"
                                             onkeyup="javascript:this.value=this.value.toUpperCase();">
                                    <f:validateLength maximum="20" />
                                </h:inputText>
                                <h:outputLabel value="Estado:*" />
                                <h:selectOneMenu id="editarUsuarioEstadoID" value="#{creacionUsuarioSucursalDataManager.usuarioSeleccionado.usEstado}" 
                                                 required="true"
                                                 requiredMessage="El estado es obligatorio">
                                    <f:selectItems value="#{creacionUsuarioSucursalControlador.selectItemEstadoActivoInactivo}"/>
                                </h:selectOneMenu>
                            </h:panelGrid>
                            <h:panelGrid  columns="2" cellspacing="5">
                                <h:outputLabel value="Correo:*" />
                                <h:inputText id="ingActualizarCorreoUsuarioSucursalID" size="40" 
                                             value="#{creacionUsuarioSucursalDataManager.usuarioSeleccionado.usCorreo}" 
                                             required="true" 
                                             requiredMessage="El correo es requerido"
                                             disabled="true">
                                    <f:validator binding="#{mailValidador}" />
                                </h:inputText>

                                <h:outputLabel value="Contraseña:*" />
                                <p:password id="ingActualizarPassUsuarioSucursalID" value="#{creacionUsuarioSucursalDataManager.usuarioSeleccionado.usContrasena}" 
                                            feedback="true" size="25" match="ingActualziarPassUsuarioSucursalID2"
                                            validatorMessage="La contraseña debe poseer máximo 10 caracteres"
                                            requiredMessage="La contraseña es requerida"
                                            required="true"
                                            style="background-color: white; background-image: none">
                                    <f:validateLength maximum="10" />
                                </p:password>

                                <h:outputLabel value="Confirme Contraseña:*" />
                                <p:password id="ingActualziarPassUsuarioSucursalID2" value="#{creacionUsuarioSucursalDataManager.usuarioSeleccionado.usContrasena}" 
                                            feedback="true" size="25" 
                                            required="true" 
                                            requiredMessage="La contraseña es requerida"
                                            validatorMessage="La contraseña debe poseer máximo 10 caracteres"
                                            style="background-color: white; background-image: none">
                                    <f:validateLength maximum="10" />
                                </p:password>
                            </h:panelGrid>
                        </h:panelGrid>

                        <h:panelGrid columns="2" cellspacing="5">
                            <p:commandButton id="botonActualizarDatosUsuarioSucursalID" 
                                             value="Guardar" action="#{creacionUsuarioSucursalControlador.actualizarUsuarioSucursal()}" 
                                             update=":formularioCreacionUsuarioSucursalID:panelUsuariosCreadosID :formularioCreacionUsuarioSucursalID:panelIngresoUsuariosID"
                                             process=":dialogEditarUsuarioSucursalID"
                                             />
                        </h:panelGrid>
                    </p:outputPanel>
                </h:form>
            </p:dialog>
        </ui:define>
    </ui:composition> 
</html>



